Skip to main content

How to write a new documentation

Docusaurus, the platform used to create our documentation uses markdown files (.md/.mdx) to display it’s pages. To get started with adding / editing documentation follow the steps.

Clone the git repository

git clone ...

To make shure everything is in working order run

npm install

To run the Docusaurus Documentation on localhost, run the following command

npm start

The searchbar only works in the final build and is unfunctional in development mode

Step 1 - Understanding the Folder Structure

Docusaurus is configured to automatically build the sidebar from the “docs” folder

Screenshot 2023-02-12 at 19.04.45.png

Every file in the docs folder is it’s own list Item in the Sidemenu. Creating a Folder, creates a Dropdown in Docusaurus.

Screenshot 2023-02-12 at 19.22.32.png

When placing a file with the same name as the folder it is in, it will be displayed when clicking on the Dropdown and not as a child. This can be seen in “How to write a new documentation”

When there is no such File, the folder/Dropdown can’t be selected and only it’s children can be viewed. This can be seen in “SomethingSomething”

Screenshot 2023-02-12 at 19.27.06.png

Step 2 - Creating a markdown file

There are a multitude of ways to create Markdown files easily. Some options include Notion, Obsidian or creating markdown files in a text editor of choice by hand.

Creating Markdowns by Hand

Notion

Obsidian

****optional****

please follow the corresponding guides about how to handle Images and Links after Export. Here are some general considerations.

Images

Images can be embedded using the following markdown command

![<altText>](<Filepath>)
![DALL·E 2023-01-15 20.22.26 - generate me a large background with symbols randomly distributed. Use #191919 as the background.png](DALLE_2023-01-15_20.22.26_-_generate_me_a_large_background_with_symbols_randomly_distributed._Use_191919_as_the_background.png)

In this example Image is placed inside the same folder as the file, it is embedded in. (embedded in “How to write a new documentation.md”)

Screenshot 2023-02-12 at 19.41.29.png

Links to other pages can be added using the following command

[<DisplyedName>](<Link>)
[Notion](Notion.md)

In this example all files are located in the same folder.

Screenshot 2023-02-12 at 19.45.25.png

Step 4 - Testing

To run the Documentation on localhost, run the following command

npm start